
<template>
    <div>
        <el-dialog title="提示" :visible.sync="dialogVisible" width="110rem !important" @click="resetForm('formName')">
            <el-form :model="ruleForm" :rules="rules" ref="formName" label-width="9rem" class="demo-ruleForm form">
                <el-row>
                    <el-col :span="8">
                        <el-form-item label="鱼池：" prop="fishpondId" label-width="12rem">
                            <el-select v-model="ruleForm.fishpondId" placeholder="请选择鱼池" @focus="handleChange" clearable
                                :popper-append-to-body="false">
                                <el-option v-for="item in fishpondSelectArray" :key="item.id" :label="item.name"
                                    :value="item.id"></el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item label="类型：" prop="fishCode" label-width="14rem">
                            <el-select @change="getFisheName" v-model="ruleForm.fishCode" placeholder="请选择类型" clearable
                                :popper-append-to-body="false">
                                <el-option v-for="item in fishTypesArray" :key="item.fishCode" :label="item.fishName"
                                    :value="item.fishCode"></el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item label="批次：" prop="batchCode" label-width="12rem">
                            <el-select @change="getSex" v-model="ruleForm.batchCode" placeholder="请选择批次" clearable
                                :popper-append-to-body="false">
                                <el-option v-for="item in batchArray" :key="item.code" :label="item.name"
                                    :value="item.code"></el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="8">
                        <el-form-item label="鱼名：" prop="fishName" label-width="12rem">
                            <el-select v-model="ruleForm.fishName" placeholder="请选择鱼名" clearable
                                :popper-append-to-body="false">
                                <el-option v-for="item in fishArray" :key="item.fishName" :label="item.fishName"
                                    :value="item.fishName"></el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item label="性别：" prop="sex" label-width="14rem">
                            <el-select v-model="ruleForm.sex" :popper-append-to-body="false" placeholder="请选择性别" clearable>
                                <el-option label="未鉴定" value="0"></el-option>
                                <el-option label="雄" value="1"></el-option>
                                <el-option label="雌" value="2"></el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item label="卵径：" prop="diameter" label-width="12rem">
                            <el-select v-model="ruleForm.diameter" placeholder="请选择卵径" clearable
                                :popper-append-to-body="false">
                                <el-option v-for="item in diametersArray" :key="item.id" :label="item.diameter"
                                    :value="item.diameter"></el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="8">
                        <el-form-item label="数量：" prop="num" label-width="12rem">
                            <el-input-number v-model="ruleForm.num" placeholder="请输入数量" :precision="0" :step="1"
                                :min="0"></el-input-number>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item label="初重：" prop="weightPrime" label-width="14rem">
                            <el-input-number v-model="ruleForm.weightPrime" placeholder="请输入初重" :precision="6" :step="1"
                                :min="0"></el-input-number>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item label="均重：" prop="weightAve" label-width="12rem">
                            <el-input-number disabled @change="calcWeight" v-model="weightAve" placeholder="请输入均重"
                                :precision="6" :step="1" :min="0"></el-input-number>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="8">
                        <el-form-item label="总重：" prop="weight" label-width="12rem">
                            <el-input-number v-model="ruleForm.weight" placeholder="请输入总重" :precision="6" :step="1"
                                :min="0"></el-input-number>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item label="单价：" prop="iprice" label-width="14rem">
                            <el-input-number v-model="ruleForm.iprice" placeholder="请输入单价" :precision="2" :step="1"
                                :min="0"></el-input-number>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item label="金额：" prop="isum" label-width="12rem">
                            <el-input-number v-model="ruleForm.isum" placeholder="请输入均重" :precision="6" :step="1"
                                :min="0"></el-input-number>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="8">
                        <el-form-item label="原采购价：" prop="reiprice" label-width="12rem">
                            <el-input-number v-model="ruleForm.reiprice" placeholder="请输入初重" :precision="2" :step="1"
                                :min="0"></el-input-number>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item label="原采购金额：" prop="reisum" label-width="14rem">
                            <el-input-number v-model="ruleForm.reisum" placeholder="请输入原采购金额" :precision="2" :step="1"
                                :min="0"></el-input-number>
                        </el-form-item>
                    </el-col>
                </el-row>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="resetForm('formName')" class="btn">取 消</el-button>
                <el-button type="primary" @click="submitForm('formName')" class="btn-light-blue btn">保 存</el-button>
            </div>
        </el-dialog>
        <SelectFishpond :bindIsDialog="bindIsDialog" :companyId="companyId" :baseId="baseId"
            @selectFishData="getSelectFishData"></SelectFishpond>
    </div>
</template>

<script>
import SelectFishpond from "./selectFishpond.vue";
import { getObjDiameters } from "@/api/breeding";
import { saveDataStockInOrderDetailPad, getObjFishBatchs, getObjFishs, getObjFishTypes, getDataStockInOrderDetailPad } from "@/api/godown";
export default {
    components: {
        SelectFishpond,
    },
    props: {
        rule: {
            type: Object,
            default: {}
        },

    },

    data() {
        return {
            baseId: '',
            companyId: '',
            dialogVisible: false,
            ruleForm: {
                // 表单字段
                companyId: "",
                baseId: "",
                stockInOrderId: "",
                id: "",
                fishpondId: "",
                batchCode: "",
                diameter: "",
                fishCode: "",
                fishName: "",
                iprice: "",
                isum: "",
                num: "",
                reiprice: "",
                reisum: "",
                sex: "",
                weight: "",
                weightAve: "",
                weightPrime: "",
                remark: "",
            },
            rules: {
                // 表单规则
                fishpondId: [{ required: true, message: "请选择鱼池", trigger: "change" }],
                fishName: [{ required: true, message: "请输入鱼名", trigger: "blur" }],
                batchCode: [{ required: true, message: "请选择批次", trigger: "change" }],
                sex: [{ required: true, message: "请选择性别", trigger: "change" }],
                diameter: [{ required: true, message: "请输入卵径", trigger: "blur" }],
                num: [{ required: true, message: "请输入数量", trigger: "blur" }],
                weightPrime: [{ required: true, message: "请输入初重", trigger: "blur" }],
                weightAve: [{ required: true, message: "请输入均重", trigger: "blur" }],
                weight: [{ required: true, message: "请输入总重", trigger: "blur" }],
                iprice: [{ required: true, message: "请输入单价", trigger: "blur" }],
                isum: [{ required: true, message: "请输入金额", trigger: "blur" }],
                reiprice: [{ required: true, message: "请输入原采购价", trigger: "blur" }],
                reisum: [{ required: true, message: "请输入原采购金额", trigger: "blur" }],
                remark: [{ required: false, message: "请输入备注", trigger: "blur" }],
            },
            addEditIsDialog_c: false, // 弹窗是否显示
            bindIsDialog: false, // 选择鱼池是否显示
            batchArray: [], // 批次集合
            fishArray: [], // 批次集合
            fishTypesArray: [], // 鱼类型集合
            diametersArray: [], // 卵径集合
            fishpondSelectArray: [], // 选中鱼池
        }
    },
    computed: {
        weightAve: {
            get() {
                return this.ruleForm.weight / this.ruleForm.num;
            },
            set(newVal) {
                this.ruleForm.weightAve = newVal;
            },
        },
    },
    methods: {
        // 筛选鱼名
        getFisheName(val) {
            const { label, value } = val
            let a = { id: this.companyId, typeId: label }
            console.log(a);
            getObjFishs(a).then((res) => {
                if (res.code == 200) {
                    this.fishArray = res.data;
                }
            });

        },
        // 获取性别
        getSex(val) {
            const { value, label } = val
            // console.log(val);
            console.log(label);
            if (label.includes('雄')) {
                this.ruleForm.sex = '1'
            } if (label.includes('雌')) {
                this.ruleForm.sex = '2'
            } else if (label.includes('未鉴别')) {
                this.ruleForm.sex = '0'
            }
        },
        // 计算重量
        calcWeight(val) {
            this.ruleForm.weightAve = val;
        },
        // 选择鱼池
        handleChange() {
            this.bindIsDialog = true;
        },
        // 提交
        submitForm(formName) {
            this.$refs[formName].validate((valid) => {
                if (valid) {
                    this.ruleForm.baseId = this.baseId
                    this.ruleForm.companyId = this.companyId
                    this.ruleForm.batchCode = this.ruleForm.batchCode
                    this.ruleForm.fishCode = this.ruleForm.fishCode
                    saveDataStockInOrderDetailPad(this.ruleForm).then((res) => {
                        if (res.code == 200) {
                            // 返回数据
                            this.$emit("backData", res.data);
                            this.$message({
                                type: "success",
                                message: res.msg,
                            });
                            // 关闭弹窗
                            this.dialogVisible = false

                            
                            // 刷新列表
                            this.$parent.getDetail();
                        }
                    });
                }
            });
        },
        // 取消
        resetForm(formName) {
            this.$refs[formName].resetFields();
            this.$parent.closeAddEdit();
            this.dialogVisible = false
        },
        // 弹窗关闭
        closeBind() {
            this.bindIsDialog = false;
        },
        // 获取批次列表
        getObjFishBatchs() {
            getObjFishBatchs({ id: this.companyId }).then((res) => {
                if (res.code == 200) {
                    this.batchArray = res.data;
                }
            });
        },
        // 获取鱼档案列表
        getObjFishs() {
            getObjFishs({ id: this.companyId }).then((res) => {
                if (res.code == 200) {
                    this.fishArray = res.data;
                }
            });
        },
        // 获取类型列表
        getObjFishTypes() {
            getObjFishTypes({ id: this.companyId }).then((res) => {
                if (res.code == 200) {
                    this.fishTypesArray = res.data;
                }
            });
        },
        // 获取卵径列表
        getObjDiameters() {
            getObjDiameters().then((res) => {
                if (res.code == 200) {
                    this.diametersArray = res.data;
                }
            });
        },
        // 选择鱼池信息
        getSelectFishData(data) {
            this.ruleForm.fishpondId = data.id;
            this.fishpondSelectArray.push(data);
        },

    }
};
</script>
<style lang="less" scoped>
/deep/ .el-dialog__footer {
    text-align: center;
}

/deep/ .el-dialog__close {
    display: none !important;
}

/deep/.el-dialog__body {
    font-size: 1.86rem !important;
    width: 100%;
}

.demo-ruleForm {
    width: 95%;
    margin: 0 auto;
    padding-top: 10px;
}

.el-cascader {
    width: 100%;
}

.el-select {
    width: 100%;
}

.form {
    width: 100%;
    height: 53rem;

    /deep/.el-form-item__content {
        line-height: 4.857143rem;
    }

    /deep/.el-form-item {
        margin-bottom: 4.79rem;
    }

    /deep/.el-input__inner {
        width: 20.64rem;
        height: 5rem;
        font-size: 1.86rem;
    }

    /deep/.el-form-item__label {
        font-size: 1.86rem;
        line-height: 5rem;
    }

    /deep/ .el-input-number {
        width: 20.857143rem;
        line-height: 4.814286rem;

        .el-input-number__decrease,
        .el-input-number__increase {
            width: 4.857143rem;
        }
    }

    ::v-deep .el-select-dropdown__empty {
        padding: 0.814286rem 3.3rem;
        font-size: 2rem;
    }

    ::v-deep .el-select-dropdown__list {
        .el-select-dropdown__item {
            font-size: 2rem;
            height: 4.428571rem;
            line-height: 4.428571rem;
        }
    }
}

.btn {
    width: 8.65rem;
    height: 4.48rem;
    font-size: 2.19rem;
}
</style>
